<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>微信修改</title>
		<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="../css/mui.min.css">
		<script src="../js/jquery.min.js"></script>
		<script type="text/javascript" src="../js/zepto.js"></script>
		<script src="../js/touch.min.js"></script>
		<script src="../js/layer/layer.js"></script>
		<style type="text/css">
			*{
				margin: 0rem;
				padding: 0rem;
				text-decoration: none;
				list-style: none;
				
			}
			html,body{
				background-color: #fff;
				width: 100%;
				height: 100%;
				 /*font-size:  100rem;*/
				 font-size: calc(100vw / 7.5);
				 font-family: "microsoft yahei";
			}
			/*头部*/
			.wrapper .header{
				display: flex;
				width: 100% ;
				height: 0.88rem;
				background: #809fba;
			}	
			.wrapper .header div{
				height: 100%;
				font-size: 0.30rem;
				text-align: center;
				line-height: 0.88rem;
				color: #fff;
			}
			.con{
				flex: 8;
			}
			.arrow img{
				width: 0.41rem;
				height: 0.3rem;
				display: inline-block;
			}
			.dot img{
				width: 0.41rem;
				height: 0.09rem;
				display: inline-block;
				margin-bottom: 3px;
			}
			.arrow{
				flex: 1;
				/* background: url("../img/arrow.png") no-repeat center; */
				background-size: contain;
			}
			.dot{
				flex: 1;
			}
			/*内容*/
			.content{
				width: 100%;
				position: relative;
				min-height: 10.8rem;
			}
			.content form {
				width: 100%;
			}
			.content form .info{
				box-sizing: border-box;
				height: 1rem;
				line-height: 1rem;
				font-size: 0.28rem;
				width: 96%;
				margin-left: 3%;
				color: #9a9a9a;
				border-color: #fff;
				border-bottom: 1px solid #e9f0f0;
			}
			
			.content form .sub{
				position: absolute;
				bottom: 0.8rem;
				left: 0.64rem;
				width: 6.25rem;
				height: 0.9rem;
				background: #7f9eba;
				color: #fff;
			}
		</style>
	</head>

	<body>
		<script>
			$(function(){
				$("#wrapper").load("../header.html")
				
			})
			setTimeout(function(){
				$("#wrapper").find(".con").html("修改微信号").end().find(".dot img").css("display","none");
				$(".arrow").on("tap",function(){
				window.location.href = "zhifuxinxi.html";
			})
			},200)
			setTimeout(function(){
				$("#wrapper").find(".con").html("修改微信号").end().find(".dot img").css("display","none");
				$(".arrow").on("tap",function(){
				window.location.href = "zhifuxinxi.html";
			})
			},2000)
		</script>
		
		<div class="wrapper" id="wrapper"></div>
		<div class="content">
			<form action="" method="post" id="">
				<input type="text" name="" class="info" value="" id="info"  placeholder="填写新的微信号码"/>
				<input type="button" id="sub" class="sub" value = "确认">
			</form>
		</div>
	
	
	
		
		<script src="../js/mui.min.js"></script>
		<script>
			if(localStorage.wechat_id){
				$("#info").val(localStorage.wechat_id)
			}


			$("#sub").on("click",function(){
				if($("#info").val()){
					var new_wechat = $("#info").val();
					
					$.ajax({
						type: "POST",
						url: `${localStorage.top}api/UserCenter/changeWechat`,
						data:{
							"TOKEN":`${localStorage.token}`,
							"new_wechat": `${new_wechat}`
						},
						success: successed,
						error: function(){}
					})
				}else{
					layer.msg("请输入正确的微信号")
				}
			})

			function successed(data){
				console.log(data)
				if(data.code == localStorage.erro){
					layer.msg(data.msg)
				}else{
					localStorage.wechat_id = $("#info").val();
					console.log(data.msg);
					layer.msg(data.msg)
					setTimeout(function(){
						$(".arrow").trigger("tap")
					},1500)
				}
				
			}


		</script>
	</body>

</html>